<template>
    <div >
        <el-table border ref="multipleTable" :data="customers" tooltip-effect="dark" style="width: 100%" @row-click="get_row_data" @select="mergeobj">
            <el-table-column prop="customerId" type="selection" width="70" header-align="center" align="center"></el-table-column>
            <el-table-column prop="customerName" label="客户名称" header-align="center" align="center"  >
                <template slot-scope="s">
                    <router-link :to="{path:'/customer_view',query:{cid:s.row}}" >{{s.row.customerName}}</router-link>
                </template>
            </el-table-column>
            <el-table-column  prop="cusType.customerType" label="客户类型" header-align="center" align="center">
                <template  slot="header">
                    <el-dropdown @command="getRow">
                        <span class="el-dropdown-link">
                            客户类型<i class="el-icon-arrow-down el-icon--right"></i>
                        </span>
                        <el-dropdown-menu slot="dropdown" >
                            <el-dropdown-item v-for="item in customertype_options" :key="item.customerTypeId"  :command="item.customerTypeId">{{item.customerType}}</el-dropdown-item>
                        </el-dropdown-menu>
                    </el-dropdown>
                </template>
            </el-table-column>
            <el-table-column prop="contact[0].contactName" label="主联系人" width="150" header-align="center" align="center"> </el-table-column>
            <el-table-column prop="contact[0].contactTel" label="电话" header-align="center" align="center"></el-table-column>
                <el-table-column prop="contact[0].contactPhone" label="手机" header-align="center" align="center"></el-table-column>
                <el-table-column prop="owner.empName" label="业务员" header-align="center" align="center"></el-table-column>
            <el-table-column prop="isCollection"  label="是否关注"  header-align="center" align="center">
                <template slot-scope="s">
                    <el-checkbox  v-model="s.row.isFocus == 1" @change="getFocusObject"></el-checkbox>
                </template>
            </el-table-column>
            <el-table-column  label="操作" header-align="center" align="center">
                <template slot-scope="s">
                    <router-link :to="{path:'/customer_view',query:{cid:s.row}}" ><el-button type="primary" size="small" icon="el-icon-view" circle></el-button></router-link>
                    <el-button type="danger" size="small"  icon="el-icon-delete" circle ></el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>

</template>

<script>

    export default {

        name: "custometable",
        props: ["customers","home"],
        data: function () {
            return {
                customertype: '',
                customertype_options: [],
                objList:[],
                focusObj:{},
                cus:{

                }
            }
        },
        methods: {
            //拿到要合并的对象
            mergeobj(rowList){
                this.objList = rowList
            },
            //关注或取关某客户       obj 要关注或者要取消关注的对象
            getFocusObject(obj){
                if(obj){
                    this.cus = this.focusObj
                    this.cus.isFocus = 1
                    this.$axios.post("api/customer/add_cus_data",this.cus)
                        .then(() => {
                           this.$parent.$parent.$parent.get_customers_data(this.home.curr_page,this.home.page_size,this.home.searchParam,this.home.customerType,this.home.stageId)
                        })
                }else{
                    this.cus = this.focusObj
                    this.cus.isFocus = 0
                    this.$axios.post("api/customer/add_cus_data",this.cus)
                        .then(() => {
                            this.$parent.$parent.$parent.get_customers_data(this.home.curr_page,this.home.page_size,this.home.searchParam,this.home.customerType,this.home.stageId)

                        })
                }
            },
            // 获取表格一行对象赋值给row
            get_row_data(data) {
                this.focusObj = data
                console.log("data");
                console.log(data);
            },


            // 获取客户类型
            get_cusType() {
                this.axios.get("api/customer/all-custype").then(v => {
                    this.customertype_options = v.data;
                }).catch(() => {
                    this.global.mes_error("客户类型数据获取失败！")
        })
            },
            getRow(row){
                this.$emit("sendcusType",row)
            },


                },
        created() {
                    this.get_cusType();
                }

            }


</script>

<style scoped>
.cell button{
    margin-left: 10px;
}
.has-gutter table tr th{
    width: 100%;
}
.icon-weidianzhongdeaixin{
    font-size: 20px;
}
.el-dropdown-link{color: #909399!important;}

</style>